
import React, { Component } from 'react';
import { observer, inject } from 'mobx-react';
import { MapPage } from 'weaver-mobile-page';
import * as VariableKeys from '../../constants/variableKey';

const getCurrentPosition = MapPage.getCurrentPosition;
@inject('wfSignInputStore')
@observer
export default class Demo extends Component {
  constructor(props) {
    super(props);
    this.state = {
      position: [],
      address: '',
      hasRenderDom: false,
      onlyCheckPosition: false,
      instance: null
    };
  }

  componentDidMount() {
    const { location:{params} } = this.props;
    let position = [], address = '', onlyCheckPosition = false;
    if(typeof params == 'object' && params.latitude && params.longitude) {
      onlyCheckPosition = true,
      position = [params.longitude, params.latitude] || [];
      address = params.address;
      this.setState({ position, address, hasRenderDom: true, onlyCheckPosition });
    } else {
      // getCurrentPosition().then((result) => {
      //   console.log('获取位置的回调111', result);
      //   if (result.status === 0) { 
      //     position = result.position;
      //     address = result.address;
      //   } 
      //   this.setState({ position, address, hasRenderDom: true, onlyCheckPosition });
      // })
        this.setState({hasRenderDom: true, onlyCheckPosition });
    }
   
  }
  
  onSubmit = (data) => {
    if(typeof data != 'object') return ;
    const { isForwad = false, controlVariableMap } = this.props.wfSignInputStore;
    const key = isForwad ? VariableKeys.FORWARD_REMARK_LOCATION : VariableKeys.SIGN_REMARK_LOCATION;
    let arr = [];
    if(!data.location || !data.address) {
      window.history.back();
      return 
    } 
    arr = data.location && data.location.split(',');
    controlVariableMap(key, { latitude:arr[1], longitude:arr[0], address: data.address });
    window.history.back();
  }
  render() {
    const { 
      hasRenderDom, 
      position = [] , 
      address = '',  
      onlyCheckPosition = false, 
      instance
    } = this.state; 
    const { positionStore } = this.props.wfSignInputStore;
    const events = {
      created: (instance) => { 
          this.setState({instance : instance});
          console.log('地图实例instance',instance)
      },
      click: () => {},
      complete: () => {
          instance.setZoom(15);
          console.log('地图实例instance',instance)
      }
    }
    let dom = (
      onlyCheckPosition ? 
      <MapPage
        store={positionStore}
        position={position}
        address={address}
        zoom={15}
      />
      : 
      <MapPage
        store={positionStore}
        ableToChangeLocation
        // position={[]}
        onSubmit={this.onSubmit}
        zoom={15}
      />
    )
    return (
      <React.Fragment>
        { hasRenderDom ? dom : <div></div> } 
      </React.Fragment>
    );
  }
}